<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
    <head>
        <title>Welcome to PimpUpMyPrints -- PimpUpMyEPrints</title>
        <script type="text/javascript" src="./javascript/auto.js">
            <!--
            padder
            -->
        </script>
        <script type="text/javascript" src="./javascript/effects.js">
            <!--
            padder
            -->
        </script>
        <script type="text/javascript" src="./javascript/dragdrop.js">
            <!--
            padder
            -->
        </script>
        <script type="text/javascript" src="./javascript/90_local.js">
            <!--
            padder
            -->
        </script>
        <script type="text/javascript" src="./javascript/colorPicker.js">
            <!--
            padder
            -->
        </script>
        <script type="text/javascript" src="./javascript/yahoo.color.js">
            <!--
            padder
            -->
        </script>
        <style type="text/css" media="screen">@import url(./style/auto.css);
        </style>
        <style type="text/css" media="screen">@import url(./style/zzz_local.css);
        </style>
        <style type="text/css" media="screen">@import url(./style/colorPicker.css);
        </style>
        <style type="text/css" media="print">@import url(./style/print.css);
        </style>
        <link rel="icon" href="./favicon.ico" type="image/x-icon" />
        <link rel="shortcut icon" href="./favicon.ico" type="image/x-icon" />
        <link rel="Top" href="#" />
        <link rel="Search" href="#" />
        <style type="text/css" media="screen">@import url(/style/nojs.css);
        </style>
        <script type="text/javascript" src="./javascript/jscss.js">
            <!--
            padder
            -->
        </script>
    </head>
    <body id="body" bgcolor="#ffffff" text="#000000" onload='float_elements(); new Control.ColorPicker("background_color_value");
 new Control.ColorPicker("foreground_color_value");'>
        <div class="ep_tm_header ep_noprint" id="header">
            <div class="ep_tm_logo">
                <a href="./"><img alt="Logo" src="./images/sitelogo.gif" id="logo" /></a>
            </div>
            <div>
                <h1 id="title">PimpUpMyEPrints</h1>
            </div>
            <ul class="ep_tm_menu" id="menu">
                <li>
                    <a href="#">Home</a>
                </li>
                <li>
                    <a href="#">About</a>
                </li>
                <li>
                    <a href="#">Browse by Year</a>
                </li>
                <li>
                    <a href="#">Browse by Subject</a>
                </li>
                <li>
                    <a href=""#">Browse by Division</a>
                </li>
            </ul>
            <table id="submenu" class="ep_tm_searchbar" border="0" cellpadding="0" cellspacing="0" width="100%">
                <tr>
                    <td align="left">
                        <a href="#">Login</a>
                        | <a href="#">Create Account</a>
                    </td>
                    <td align="right" style="white-space: nowrap">
                        <form method="get" accept-charset="utf-8" action="#" style="display:inline">
                            <input class="ep_tm_searchbarbox" size="20" type="text" name="q" /><input class="ep_tm_searchbarbutton" value="Search" type="submit" name="_action_search" /><input type="hidden" name="_action_search" value="Search" /><input type="hidden" name="_order" value="bytitle" /><input type="hidden" name="basic_srchtype" value="ALL" /><input type="hidden" name="_satisfyall" value="ALL" />
                        </form>
                    </td>
                </tr>
            </table>
        </div>
        <div align="center">
            <table width="720" class="ep_tm_main">
                <tr>
                    <td align="left">
                        <h1 class="ep_tm_pagetitle" id="heading">EPrints Quickstyle</h1>
                        <div class="ep_summary_content" id="content">
                            <div class="ep_summary_content_left">
                            </div>
                            <div class="ep_summary_content_right">
                            </div>
                            <div class="ep_summary_content_top">
                            </div>
                            <div class="ep_summary_content_main">
                                <p style="margin-bottom: 1em;" class="ep_block">
                                    <span class="person_name">Davis, Richard M.</span>
                                
                                    (2008) <em>EPrints Quickstyle.</em>
                                    Javscript Tools for EPrints
                                </p>
                                <p style="margin-bottom: 1em;" class="ep_block">
                                </p>
                                <table style="margin-bottom: 1em;" class="ep_block">
                                    <tbody>
                                        <tr>
                                            <td style="text-align: center;" valign="top">
                                                <a onmouseover="EPJS_ShowPreview( event, 'doc_preview_96' );" href="#" onmouseout="EPJS_HidePreview( event, 'doc_preview_96' );"><img alt="[img]" src="./style/images/fileicons/application_pdf.png" class="ep_doc_icon" border="0"></a>
                                                <div style="display: none; top: 147px; left: 752.75px;" class="ep_preview" id="doc_preview_96">
                                                    <table>
                                                        <tbody>
                                                            <tr>
                                                                <td>
                                                                    <img alt="" src="/96/thumbnails/1/preview.png" class="ep_preview_image" border="0">
                                                                    <div class="ep_preview_title">
                                                                        Preview
                                                                    </div>
                                                                </td>
                                                            </tr>
                                                        </tbody>
                                                    </table>
                                                </div>
                                            </td>
                                            <td valign="top">
                                                <!-- document citation --><span class="ep_document_citation"><a href="http://demoprints.eprints.org/96/1/paper.pdf">PDF</a></span>
                                                <br>
                                                11Kb
                                            </td>
                                        </tr>
                                    </tbody>
                                </table>
                                <div class="ep_block">
                                    <h2 id="subtitle">Abstract</h2>
                                    <p style="margin: 1em auto 0em; text-align: left;">
                                        This tool uses simple scripts to create a floating form that can be used to dynamically
										set the style values for elements of an EPrints page. 
										<br/><br/>
										This script only works with this demo page at the moment. It requires some hacking of the
										default EPrints template HTML (to add IDs to key elements) - this might be avoidable in future
										either by enhancements to the script, or through improvements to the default EPrints templates.
										<br/><br/>
										Then it might be possible to install it as a freestanding set of scripts with little or no
										intervention in the default code or templates.
										<br/><br/>
										The package comprises some simple functions, that can be added to 90_local.js, and some
										simple CSS additions for zzz_local.css. It also requires scriptaculous Dragdrop and Effects, and the ColorPicker 
										scripts, to be dropped into the Javascript directory.
									<br/><br/>
										It is only tested as working with Firefox at the moment.
										<br/><br/>
										THINGS TO DO: Make it write out the CSS amendments that a user can add to zzz_local.css.
			 
                                    </p>
                                </div>
                                <table style="margin-bottom: 1em;" class="ep_block" border="0" cellpadding="3">
                                    <tbody>
                                        <tr>
                                            <th class="ep_row" valign="top">
                                                Item Type:
                                            </th>
                                            <td class="ep_row" valign="top">
                                                Article
                                            </td>
                                        </tr>
                                        <tr>
                                            <th class="ep_row" valign="top">
                                                Subjects:
                                            </th>
                                            <td class="ep_row" valign="top">
                                                <a href="http://demoprints.eprints.org/view/subjects/BF.html">B Philosophy. Psychology. Religion &gt; BF Psychology</a>
                                            </td>
                                        </tr>
                                        <tr>
                                            <th class="ep_row" valign="top">
                                                ID Code:
                                            </th>
                                            <td class="ep_row" valign="top">
                                                96
                                            </td>
                                        </tr>
                                        <tr>
                                            <th class="ep_row" valign="top">
                                                Deposited By:
                                            </th>
                                            <td class="ep_row" valign="top">
                                                <span class="ep_name_citation">Unnamed user with email <a href="mailto:null@null.org">null@null.org</a></span>
                                            </td>
                                        </tr>
                                        <tr>
                                            <th class="ep_row" valign="top">
                                                Deposited On:
                                            </th>
                                            <td class="ep_row" valign="top">
                                                13 Sep 2009 04:12
                                            </td>
                                        </tr>
                                        <tr>
                                            <th class="ep_row" valign="top">
                                                Last Modified:
                                            </th>
                                            <td class="ep_row" valign="top">
                                                13 Sep 2009 04:12
                                            </td>
                                        </tr>
                                    </tbody>
                                </table>
                                <p align="right">
                                    Repository Staff Only: <a href="http://demoprints.eprints.org/cgi/users/home?screen=EPrint::View&amp;eprintid=96">item control page</a>
                                </p>
                            </div>
                            <div class="ep_summary_content_bottom">
                            </div>
                            <div class="ep_summary_content_after">
                            </div>
                        </div>
                    </td>
                </tr>
            </table>
        </div>
        <div class="ep_tm_footer ep_noprint" id="footer">
            <hr noshade="noshade" class="ep_ruler" /><hr class="ep_tm_last" />
            <div style="float: right; margin-left: 1em">
                <a href="http://eprints.org/software/"><img alt="EPrints Logo" src="/images/eprintslogo.gif" border="0" /></a>
            </div>
            <div style="font-size: 80%;">
                <div>
                    PimpUpMyEPrints is powered by <em><a href="http://eprints.org/software/">EPrints 3</a></em>
                  
                </div>
            </div>
        </div>
        <div style="font-size: small; position:absolute; top: 300px; left:100px; opacity:0.95; background-color:#aaa;padding: 0px;" id="FloatingForm">
            <div style="padding: 1px 4px; background-color: black; color: white; font-weight: bold;">
                EPrints Style Editor (You can drag me)
            </div>
            <form name="the_form">
                <table style="margin: 5px;">
                    <tr>
                        <td>
                            Feature: 
                        </td>
                        <td>
                            <select name="element_id">
                                <option value="body">Body</option>
                                <option value="header">Header</option>
                                <option value="title">Title text</option>
                                <option value="menu">Menu</option>
                                <option value="submenu">Submenu</option>
                                <option value="heading">Heading text</option>
                                <option value="subheading">Subheading text</option>
								  <option value="content">Content</option>
                                <option value="footer">Footer</option>
                            </select>
                        </td>
                    </tr>
                    <tr>
                        <td>
                            Background color: 
                        </td>
                        <td>
                            <input type="text" id="background_color_value" /><input name="change_background_color" value="Change" type="button" onclick="changeElementStyle(the_form.elements['element_id'].value,'background-color','#'+the_form.elements['background_color_value'].value);"/>
                        </td>
                    </tr>
                    <tr>
                        <td>
                            Foreground color: 
                        </td>
                        <td>
                            <input type="text" id="foreground_color_value" /><input name="change_foreground_color" value="Change" type="button" onclick="changeElementStyle(the_form.elements['element_id'].value,'color','#'+the_form.elements['foreground_color_value'].value);"/>
                        </td>
                    </tr>
                    <tr>
                        <td>
                            Font-face: 
                        </td>
                        <td>
                            <select name="font_family_value">
                                <option value="Arial, Arial, Helvetica, sans-serif">Arial</option>
                                <option value="Arial Black, Arial Black, Gadget, sans-serif">Arial Black</option>
                                <option value="Courier New, Courier New, Courier6, monospace">Courier</option>
                                <option value="Georgia, serif">Georgia</option>
                                <option value="Impact, sans-serif">Impact</option>
                                <option value="Lucida Sans Unicode, Lucida Grande, sans-serif">Lucida Sans</option>
                                <option value="Palatino Linotype, Book Antiqua, Palatino, serif">Palatino</option>
                                <option value="Times, Times new roman, serif">Times</option>
                                <option value="Verdana, Geneva, sans-serif">Verdana</option>
                            </select>
                            <input name="change_font_family" value="Change" type="button" onclick="changeElementStyle(the_form.elements['element_id'].value,'font-family',the_form.elements['font_family_value'].value);"/>
                        </td>
                    </tr>
                    <tr>
                        <td>
                            Font-size: 
                        </td>
                        <td>
                            <select name="font_size_value">
                                <option value="x-small">Extra-small</option>
                                <option value="small">Small</option>
                                <option value="medium">Medium</option>
                                <option value="large">Large</option>
                                <option value="x-large">X Large</option>
                                <option value="xx-large">XX Large</option>
                            </select>
                            <input name="change_font_size" value="Change" type="button" onclick="changeElementStyle(the_form.elements['element_id'].value,'font-size',the_form.elements['font_size_value'].value);"/>
                        </td>
                    </tr>
					          <tr>
                        <td>
                            Text align: 
                        </td>
                        <td>
                            <select name="text_align_value">
                                <option value="left">Left</option>
                                <option value="center">Centre</option>
                                <option value="right">Right</option>
                             
                            </select>
                            <input name="change_text_align" value="Change" type="button" onclick="changeElementStyle(the_form.elements['element_id'].value,'text-align',the_form.elements['text_align_value'].value);"/>
                        </td>
                    </tr>
                    <tr>
                        <td>
                            Margins:
                        </td>
                        <td>
                            <input name="increase_margin" value="Increase" type="button" onclick="changeElementStyle(the_form.elements['element_id'].value,'increase-margin',1);"/><input name="decrease_margin" value="Decrease" type="button" onclick="changeElementStyle(the_form.elements['element_id'].value,'decrease-margin',1);"/>
                        </td>
                    </tr>
                    <tr>
                        <td>
                            Padding:
                        </td>
                        <td>
                            <input name="increase_padding" value="Increase" type="button" onclick="changeElementStyle(the_form.elements['element_id'].value,'increase-padding',1);"/><input name="decrease_padding" value="Decrease" type="button" onclick="changeElementStyle(the_form.elements['element_id'].value,'decrease-padding',1);"/>
                        </td>
                    </tr>
                    <tr style="border-top: 1px solid black">
                        <td>
                            Logo:
                        </td>
                        <td>
                            <input name="logo_url" value="http://" type="text" id="logo_url"/><input type="button" value="Change" onclick="document.getElementById('logo').src = the_form.elements['logo_url'].value;"/>
                        </td>
                    </tr>
<tr><td><input type="button" value="Get CSS" onClick="write_css()"></td><td><textarea id="the_css" rows="3" cols="30"></textarea>
</td></tr>
                </table>
            </form>
        </div>
    </body>
</html>
